<template>
  <div class="contenBox">
    <div class="goods-con" @click.stop="toGood(kitem)" v-for="(kitem,index) in  item.content" :key="index">
      <div class="goods-img">
        <img :src="kitem.thumb" />
      </div>
      <div class="goods-txt">
        <div class="goods-title">{{ kitem.title }}</div>
        <div class="goods-price" v-if="kitem.price">￥{{ kitem.price }}</div>
      </div>
    </div>
  </div>
</template>
<script>
export default {
  props: ["item"],
  mounted() {
    this.$emit("loaded");
  },
  methods: {
    toGood(item) {
      if (item.id) {
        this.$router.push(this.fun.getUrl("goods", { id: item.id }));
      }
    }
  }
};
</script>
<style rel="stylesheet/scss" lang="scss" scoped>
.contenBox{
  display: flex;
  flex-direction: column;
}
.goods-con {
  background: #fff;
  display: flex;
  padding: 0.8rem;
  width: 15rem;

  .goods-img {
    width: 4.5rem;

    img {
      width: 4rem;
      height: 4rem;
    }
  }

  .goods-txt {
    flex: 1;

    .goods-title {
      color: #222;
      font-size: 14px;
    }

    .goods-price {
      margin-top: 0.8rem;
      color: #fb4a4a;
    }
  }
}
</style>
